<template>
	<section class="head">
		<p>
			<span class="goIndex"  @click="goToIndex"><img style="vertical-align: text-top;width: 17px;margin-right: 5px;" src="../assets/index.png"/>{{goIndex}}</span>
			<span class="currentTitle" v-show="currentTitle">{{indexTitle}}</span>
			<span @click="goBack" v-show="!currentTitle" class="goBack"><img style="vertical-align: text-top;width: 17px;margin-right: 5px;"  src="../assets/back.png"/>{{lastTitle}}</span>
			<span class="title" v-show="!currentTitle">
				{{$router.history.current.meta.title}}
			</span>
			<span class="time">{{time}}</span></p>
	</section>
</template>

<script>
	export default{
		data(){
			return{
				goIndex:'演示首页',
				indexTitle:"远洋宾馆欢迎您!",
				lastTitle:'返回上一页',
				currentTitle:true,
				time :'2018-09-20  10:10:24'
			}
		},
		mounted(){
			console.log(this.$router);
			this.$router.history.current.name==='index'?this.currentTitle=true:this.currentTitle=false;
		},
		methods:{
			goBack(){
				this.$router.go(-1);
			},
			goToIndex(){
				window.location.href = '/bigdata/bigdatafrond/index.html';
			}
		}
	}
</script>

<style scoped="scoped">
	p{
		/*width: 100%;*/
		height: 50px;
		background: rgb(214,112,2);
		padding: 0 10px;
		line-height: 50px;
		color: #fff;
		letter-spacing: 2px;
		font-size: 18px;
		text-align: center;
	}
	p .currentTitle{
		/*float: left;*/
	}
	p .time{
		/*float: right;*/
		position: absolute;
		right: 20px;
		/*margin-right: 20px;*/
		font-size: 13px;
	}
	p .goBack{
		font-size: 13px;
	    cursor: pointer;
	    position: absolute;
	    left: 120px;
	}
	p .title{
		width: 80px;
	}

	p .goIndex{
		font-size: 13px;
		cursor: pointer;
		position: absolute;
		left: 20px;
	}
</style>
